import React, { Component } from 'react'
import {
  View,
  Text,
  Button
} from 'react-native'
import Toast from 'react-native-root-toast'
import * as request from '../../utils/fetch';
import * as service from '../../utils/service';
import Style from '../../utils/style/style'
import SwiperView from '../../views/SwiperView';
import Desktop from '../../views/DesktopView';
import o from '../../components/o'
import { login, getToken } from '../../actions/LoginAction'
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as utils from '../../utils/utils';
class Home extends Component {
  constructor(props) {
    super(props);
    this.state = {
      bannerList: []
    }
  }
  static navigationOptions = {
    tabBarLabel: '工作台',
    headerTitle: '工作台',
  };

  componentDidMount() {
    const { openid, token } = this.props;
    if (!openid) {
      this.props.navigation.replace('Login')
    } else if (!token) {
      this.props.getToken({ openid: openid });
    } else {
      this._getBannerList();
    }
  }


  _getBannerList() {
    const { token } = this.props
    let params = {
      select: 'RecId,topicName,topicContent,topicAttach',
      filter: `topicStatus eq 2 and topicAttach ne ''`,
      api: `TopicReleases?token=${token}`
    }
    o(params.api).select(params.select).filter(params.filter).get((res) => {
      for (let i = 0; i < res.length; i++) {
        let topicImg = utils.handleBannerImg(res[i].topicAttach)
        res[i].topicAttach = topicImg
      }
      console.log(res)
      this.setState({
        bannerList: res
      })
    });
  }

  _onClick = (item) => {
    //goDetail
    const { navigation } = this.props;
    navigation.navigate('BannerDetail', { item: item.RecId })
  }
  _navigateTo(type) {
    this.props.navigation.navigate(type)
  }
  render() {
    //涉及权限 可能从后端获取
    // alert("render home")
    const { permission } = this.props;
    const workList = [
      { id: 1, name: '采购', routeName: 'Purchase', tintColor: '#3f51b5', iconName: 'paste', click: () => { this.props.navigation.navigate('Purchase') }, show: permission.PURCHASE },
      { id: 2, name: '销售', routeName: 'Sales', tintColor: '#009688', iconName: 'calculator', click: () => { this.props.navigation.navigate('Sales') }, show: permission.SALE },
      { id: 3, name: '盘点', routeName: 'Checks', tintColor: '#f44336', iconName: 'braille', click: () => { this.props.navigation.navigate('Checks') }, show: permission.CHECKS },
    ]
    const { bannerList } = this.state
    return (
      !this.props.userInfo ?
        <View />
        :
        <View style={[{ flex: 1 }]}>
          {bannerList && bannerList.length > 0 ?
            <SwiperView bannerList={this.state.bannerList} pressItem={this._onClick} /> : null}
          <Desktop workList={workList} />
        </View>
    );
  }
}
function select(store) {
  return {
    userInfo: store.User.userInfo
  }
}
export default connect(
  state => ({
    userInfo: state.User.userInfo,
    token: state.User.token,
    openid: state.User.openid,
    permission: state.User.permission
  }),
  dispatch => ({
    getToken: bindActionCreators(getToken, dispatch)
  })
)(Home)